/*
 * @Author: 陈明烽
 * @FilePath: \evdata\src\FullScreen\index.tsx
 * @Description: 大屏展示基础平面 16:9
 */
import * as React from 'react';
import { useState, useEffect, FC, useRef, useLayoutEffect } from 'react';
import {} from 'antd';
import { useSize } from 'ahooks';
import './index.less';
interface FullScreenProps {
  height?: number;
  width?: number;
}
const FullScreen: FC<FullScreenProps> = props => {
  const { children, height, width } = props;
  const size = useSize(document.body);
  const domRef = useRef<HTMLDivElement>(null);
  useLayoutEffect(() => {
    console.log(width);
    let w = width || window.screen.width;
    let h = height || window.screen.height;

    if (domRef && domRef.current) {
      domRef.current.style.transform = `scale(${document.body.clientWidth /
        w})`;
      Object.assign(domRef.current.style, {
        width: `${w}px`,
        height: `${h}px`,
      });
    }
  }, [size]);
  return (
    <div className="dv-full-screen" ref={domRef}>
      {children}
    </div>
  );
};
export default FullScreen;
